<template>
  <div class="container-fluid">
    <div class="row center-block">
      <div class="col-md-12">
        <div class="row">
          <div class="col-md-12">
            <div class="box-body">
              <div class="box box-primary">
                <div class="box-body">
                  <div class="row">
                    <label class="col-sm-2 control-label">时间</label>
                    <div class="col-sm-4">
                      <MyDatePicker v-bind:date='belongTime' @timeChanged="(time)=>this.ontimechanged(time)" ref="belongTime"></MyDatePicker>
                    </div>
                    <div class="col-sm-4">
                      <button type="button" class="btn btn btn-success pull-right">
                        <i class="fa fa-save" @click="exportData">导出</i>
                      </button>
                    </div>
                  </div>
                  <div class="row">
                    <div class="col-sm-12 table-responsive">
                      <table aria-describedby="example1_info" role="grid" id="example1" class="table table-striped table-bordered">
                        <thead>
                          <tr role="row">
                            <th aria-label="指标名称" style="width: 167px;" colspan="1" rowspan="1" tabindex="0">指标名称</th>
                            <th aria-label="代码" style="width: 60px;" colspan="1" rowspan="1" tabindex="0">代码</th>
                            <th v-for="item in departments" :key="item.departmentId" aria-label="本月实有" style="width: 60px;" colspan="1" rowspan="1" tabindex="0">本月实有</th>
                            <th aria-label="小计" style="width: 60px;" colspan="1" rowspan="1" tabindex="0">小计</th>
                             <th aria-label="指标名称" style="width: 167px;" colspan="1" rowspan="1" tabindex="0">指标名称</th>
                            <th aria-label="代码" style="width: 60px;" colspan="1" rowspan="1" tabindex="0">代码</th>
                            <th v-for="item in departments" :key="item.departmentId" aria-label="本月实有" style="width: 60px;" colspan="1" rowspan="1" tabindex="0">本月实有</th>
                            <th aria-label="小计" style="width: 60px;" colspan="1" rowspan="1" tabindex="0">小计</th>
                            <th aria-label="指标名称" style="width: 167px;" colspan="1" rowspan="1" tabindex="0">指标名称</th>
                            <th aria-label="代码" style="width: 60px;" colspan="1" rowspan="1" tabindex="0">代码</th>
                            <th v-for="item in departments" :key="item.departmentId" aria-label="本月实有" style="width: 60px;" colspan="1" rowspan="1" tabindex="0">本月实有</th>
                            <th aria-label="小计" style="width: 60px;" colspan="1" rowspan="1" tabindex="0">小计</th>
                          </tr>
                        </thead>
                        <tbody>
                          <tr class="even" role="row">
                            <td></td>
                            <td></td>
                            <td v-for="item in departments" :key="item.departmentId">{{ shortname(item.name)}}</td>
                            <td></td>
                            <td></td>
                            <td></td>
                            <td v-for="item in departments" :key="item.departmentId">{{shortname(item.name)}}</td>
                            <td></td>
                            <td></td>
                            <td></td>
                            <td v-for="item in departments" :key="item.departmentId">{{shortname(item.name)}}</td>
                            <td></td>
                          </tr>
                          <tr class="even" role="row">
                            <td class="">一、从业人员月末人数</td>
                            <td>01</td>
                            <td v-for="(item, index) in stats" :key="getKey(index,'people')">{{item.people}}</td>
                            <td class="">工程技术</td>
                            <td>17</td>
                            <td v-for="(item, index) in stats" :key="getKey(index,'eng')">{{item.engineering}}</td>
                            <td class="">三、从业人员变动情况</td>
                            <td>32</td>
                            <td v-for="(item, index) in stats" :key="getKey(index,'tchange')">{{item.totalChanges}}</td>
                          </tr>
                          <tr class="even" role="row">
                            <td class=""> 其中：女性</td>
                            <td>02</td>
                            <td v-for="(item, index) in stats" :key="getKey(index,'females')">{{item.females}}</td>
                            <td class="">广告营销</td>
                            <td>18</td>
                            <td v-for="(item, index) in stats" :key="getKey(index,'adMarketing')">{{item.adMarketing}}</td>
                            <td class="">（一）增加人数</td>
                            <td>33</td>
                            <!-- <td> {{thismonthincreaseWorkers}}</td> -->
                            <td v-for="(item, index) in stats" :key="getKey(index,'increaseWorkers')">{{item.increaseWorkers}}</td>
                          </tr>
                          <tr class="even" role="row">
                            <td class=""> （一）职工人数</td>
                            <td>03</td>
                            <td v-for="(item, index) in stats" :key="getKey(index,'totalEmployees')">{{item.totalEmployees}}</td>
                            <!-- <td>{{thismonthtotalEmployees}}</td>
                            <td>{{lastmonthtotalEmployees}}</td> -->
                            <td class="">工勤</td>
                            <td>19</td>
                            <td v-for="(item, index) in stats" :key="getKey(index,'worker')">{{item.worker}}</td>
                            <td class="">从社会招聘录用</td>
                            <td>34</td>
                            <td v-for="(item, index) in stats" :key="getKey(index,'fromSocial')">{{item.fromSocial}}</td>
                          </tr>
                          <tr class="even" role="row">
                            <td class="">事业编制固定制职工</td>
                            <td>04</td>
                            <td v-for="(item, index) in stats" :key="getKey(index,'fixedEmployee')">{{item.fixedEmployee}}</td>
                            <td class="">（二）其他从业人员</td>
                            <td>20</td>
                            <td v-for="(item, index) in stats" :key="getKey(index,'otherWorkers')">{{item.otherWorkers}}</td>
                            <td class="">转业、退伍军人</td>
                            <td>35</td>
                            <td v-for="(item, index) in stats" :key="getKey(index,'fromTransfer')">{{item.fromTransfer}}</td>
                          </tr>
                          <tr class="even" role="row">
                            <td class="">事业编制聘用制职工</td>
                            <td>05</td>
                            <td v-for="(item, index) in stats" :key="getKey(index,'inviteEmployee')">{{item.inviteEmployee}}</td>
                            <td class="">聘用的离退休人员</td>
                            <td>21</td>
                            <td v-for="(item, index) in stats" :key="getKey(index,'retiedWorker')">{{item.retiedWorker}}</td>
                            <td class="">录用的大中专应届生</td>
                            <td>36</td>
                            <td v-for="(item, index) in stats" :key="getKey(index,'student')">{{item.student}}</td>
                          </tr>
                          <tr class="even" role="row">
                            <td class="">集团企聘职工</td>
                            <td>06</td>
                            <td v-for="(item, index) in stats" :key="getKey(index,'groupEmployee')">{{item.groupEmployee}}</td>
                            <td class="">三方协议借用人员</td>
                            <td>22</td>
                            <td v-for="(item, index) in stats" :key="getKey(index,'threePartWorker')">{{item.threePartWorker}}</td>
                            <td class="">从集团内部单位调入</td>
                            <td>37</td>
                            <td v-for="(item, index) in stats" :key="getKey(index,'fromInternalOfCompany')">{{item.fromInternalOfCompany}}</td>
                          </tr>
                          <tr class="even" role="row">
                            <td class="">直属单位聘用职工</td>
                            <td>07</td>
                            <td v-for="(item, index) in stats" :key="getKey(index,'directEmployee')">{{item.directEmployee}}</td>
                            <td class="">非全日制用工人员</td>
                            <td>23</td>
                            <td v-for="(item, index) in stats" :key="getKey(index,'partTimeWorker')">{{item.partTimeWorker}}</td>
                            <td class="">从集团外单位调入</td>
                            <td>38</td>
                            <td v-for="(item, index) in stats" :key="getKey(index,'fromOutOfCompany')">{{item.fromOutOfCompany}}</td>
                          </tr>
                          <tr class="even" role="row">
                            <td class="">文化程度</td>
                            <td>08</td>
                            <td v-for="(item, index) in stats" :key="getKey(index,'totaledus')">{{item.totaledus}}</td>
                            <td class="">其他</td>
                            <td>24</td>
                            <td v-for="(item, index) in stats" :key="getKey(index,'otherWorker')">{{item.otherWorker}}</td>
                            <td class="">其他</td>
                            <td>39</td>
                            <td v-for="(item, index) in stats" :key="getKey(index,'fromOther')">{{item.fromOther}}</td>
                          </tr>
                          <tr class="even" role="row">
                            <td class="">研究生</td>
                            <td>09</td>
                            <td v-for="(item, index) in stats" :key="getKey(index,'graduate')">{{item.graduate}}</td>
                            <td class=""></td>
                            <td></td>
                            <td v-for="(item, index) in stats" :key="getKey(index,'empty')"> </td>
                            <td class="">（二）减少人数</td>
                            <td>40</td>
                            <td v-for="(item, index) in stats" :key="getKey(index,'decreaseWorkers')">{{item.decreaseWorkers}}</td>
                          </tr>
                          <tr class="even" role="row">
                            <td class="">大学本科</td>
                            <td>10</td>
                            <td v-for="(item, index) in stats" :key="getKey(index,'undergraduate')">{{item.undergraduate}}</td>
                            <td class="">二、保留劳动关系的职工</td>
                            <td>25</td>
                            <td v-for="(item, index) in stats" :key="getKey(index,'totalkeeps')">{{item.totalkeeps}}</td>
                            <td class="">退休</td>
                            <td>41</td>
                            <td v-for="(item, index) in stats" :key="getKey(index,'retired')">{{item.retired}}</td>
                          </tr>
                          <tr class="even" role="row">
                            <td class="">大专</td>
                            <td>11</td>
                            <td v-for="(item, index) in stats" :key="getKey(index,'juniorCollege')">{{item.juniorCollege}}</td>
                            <td class="">离岗退养职工</td>
                            <td>26</td>
                            <td v-for="(item, index) in stats" :key="getKey(index,'keepRetired')">{{item.keepRetired}}</td>
                            <td class=""> 解除、终止合同</td>
                            <td>42</td>
                            <td v-for="(item, index) in stats" :key="getKey(index,'interrupt')">{{item.interrupt}}</td>
                          </tr>
                          <tr class="even" role="row">
                            <td class="">中专及高中</td>
                            <td>12</td>
                            <td v-for="(item, index) in stats" :key="getKey(index,'highSchool')">{{item.highSchool}}</td>
                            <td class="">长期病假职工</td>
                            <td>27</td>
                            <td v-for="(item, index) in stats" :key="getKey(index,'keepIll')">{{item.keepIll}}</td>
                            <td class=""> 辞职、辞退</td>
                            <td>43</td>
                            <td v-for="(item, index) in stats" :key="getKey(index,'resignation')">{{item.resignation}}</td>
                          </tr>
                          <tr class="even" role="row">
                            <td class="">初中及以下</td>
                            <td>13</td>
                            <td v-for="(item, index) in stats" :key="getKey(index,'juniorMiddleSchool')">{{item.juniorMiddleSchool}}</td>
                            <td class="">脱产学习职工</td>
                            <td>28</td>
                            <td v-for="(item, index) in stats" :key="getKey(index,'keepStudy')">{{item.keepStudy}}</td>
                            <td class="">集团内部调动</td>
                            <td>44</td>
                            <td v-for="(item, index) in stats" :key="getKey(index,'changed')">{{item.changed}}</td>
                          </tr>
                          <tr class="even" role="row">
                            <td class="">工作岗位</td>
                            <td>14</td>
                            <td v-for="(item, index) in stats" :key="getKey(index,'positions')">{{item.positions}}</td>
                            <td class="">待岗职工</td>
                            <td>29</td>
                            <td v-for="(item, index) in stats" :key="getKey(index,'keepChange')">{{item.keepChange}}</td>
                            <td class="">调离集团</td>
                            <td>45</td>
                            <td v-for="(item, index) in stats" :key="getKey(index,'out')">{{item.out}}</td>
                          </tr>
                          <tr class="even" role="row">
                            <td class="">采编</td>
                            <td>15</td>
                            <td v-for="(item, index) in stats" :key="getKey(index,'editing')">{{item.editing}}</td>
                            <td class="">借给集团外单位职工</td>
                            <td>30</td>
                            <td v-for="(item, index) in stats" :key="getKey(index,'keepBorrow')">{{item.keepBorrow}}</td>
                            <td class="">开除</td>
                            <td>46</td>
                            <td v-for="(item, index) in stats" :key="getKey(index,'fired')">{{item.fired}}</td>
                          </tr>
                          <tr class="even" role="row">
                            <td class=""> 行政管理</td>
                            <td>16</td>
                            <td v-for="(item, index) in stats" :key="getKey(index,'administrativeManagement')">{{item.administrativeManagement}}</td>
                            <td class="">其他</td>
                            <td>31</td>
                            <td v-for="(item, index) in stats" :key="getKey(index,'keepOther')">{{item.keepOther}}</td>
                            <td class="">其他</td>
                            <td>47</td>
                            <td v-for="(item, index) in stats" :key="getKey(index,'toOther')">{{item.toOther}}</td>
                          </tr>
                        </tbody>
                      </table>
                    </div>
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
import monthApi from "../../../common/monthapi";
import Depart from "../../mycomponents/common/Depart";
import MyDatePicker from "../../mycomponents/common/MyDatePicker";
import Utils from "../../../common/utils";
import thiss from "../../../common/utils";
let util = new Utils();
let api = new monthApi();
export default {
  name: "monthdetail",
  components: {
    Depart,
    MyDatePicker
  },
  created: function() {
    var mydate = api.getThisMonth();
    this.belongTime = mydate;
    this.loadDepartshotname();
    this.stats = this.loadDefaultVals()
    this.loaddata(mydate)
  },
  data: function() {
    return {
      stats: [],
      departments: [],
      // departname: "",
      belongTime: "",
      editable: false
    };
  },
  methods: {
    shortname(name) {
      // console.log(name);
      if(name.indexOf('中心')>8){
        return '中心'
      }
      if(name.indexOf('第四') > 2){
        return '省四'
      }
      return name.substring(3, 5);
    },
    getKey(index,prop){
      return prop +'_'+ index
    },
    loadDepartshotname() {
      var departs = [];
      var depart = this.$store.state.departments[0];
      this.departments.push(depart);
      for (
        var index = 0;
        index < this.$store.state.departments[0].subDepartments.length;
        index++
      ) {
        this.departments.push(
          this.$store.state.departments[0].subDepartments[index]
        );
      }
    },
    exportData() {
      api.export(this.belongTime, 2,this.$store.state.user.id);
    },
    ontimechanged(time) {
      this.belongTime = time;
      this.loaddata(this.belongTime);
    },
    sum(prop) {
      var sumdata = 0;
      if (this.stats.length > 0) {
        for (var item in this.stats) {
          sumdata = sumdata + item[prop];
        }
      }
      return sumdata;
    },
    loadDefaultVals(){
      var sortedStats = [];
      for (var index = 0; index < this.departments.length; index++) {
        sortedStats.push(this.decorate(api.getDefaultVal()))
      }
      return this.resort(sortedStats)
    },
    loaddata(belongTime) {
      console.log("time:" + belongTime);
      var that = this;
      api.get(belongTime,2, resp => {
        // that.thismonth.departmentId = resp.body.body.department.id;
        // that.departmentId = resp.body.body.department.id;
        // that.departname = resp.body.body.department.name;
        that.stats = that.resort(resp.body.body.stats);
      });
    },
    decorate(item){
      var total = api.sum(item)
      for(var prop in total){
        item[prop] = total[prop]
      }
      return item
    },
    resort(stats) {
      var sortedStats = [];
      var dic = {}
      for (var index = 0; index < this.departments.length; index++) {
        var bFind = false;
        for (var statIndex =0; statIndex < stats.length;statIndex++) {
          if (this.departments[index].id == stats[statIndex].departmentId) {
            sortedStats.push(this.decorate(stats[statIndex]))
            bFind = true;
            break
          }
        }

        if (!bFind) {
          sortedStats.push(this.decorate(api.getDefaultVal()))
        }
      }
      var sumData = api.sumAll(sortedStats)
      if(!sumData){
        sumData = api.getDefaultVal()
      }
      sortedStats.push(sumData)
      return sortedStats;
    }
  }
};
</script>

<style>
.table > thead:first-child > tr:first-child > th {
  border-top: 1px solid #352f2f;
}
.table-bordered > tbody > tr > td,
.table-bordered > tfoot > tr > td {
  border: 1px solid #352f2f;
}
.table-bordered > thead > tr > th,
.table-bordered > tbody > tr > th,
.table-bordered > tfoot > tr > th,
.table-bordered > thead > tr > td,
.table-bordered > tbody > tr > td,
.table-bordered > tfoot > tr > td {
  border: 1px solid #352f2f;
}
.row {
  padding: 10px 10px;
}
.control-label {
  padding-top: 10px;
}
.red {
  border-color: "red";
  color: "red";
}
</style>
